<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>茂名民宿短租系统</title>

  <link rel="stylesheet" href="app/css/element-ui/lib/theme-chalk/index.css">
  <script src="app/js/Axios/axios-0.18.0.js"></script>
  <script src="app/js/Vue/vue.js"></script>
  <script src="app/css/element-ui/lib/index.js"></script>
    <style>
        .el-row {
            margin-bottom: 20px;
        &:last-child {
             margin-bottom: 0;
         }
        }
        .el-col {
            border-radius: 4px;
        }
        .bg-purple-dark {
            background: #99a9bf;
        }
        .bg-purple {
            background: #d3dce6;
        }
        .bg-purple-light {
            background: #e5e9f2;
        }
        .grid-content {
            border-radius: 4px;
            min-height: 36px;
        }
        .row-bg {
            padding: 10px 0;
            background-color: #f9fafc;
        }
    </style>

</head> 

<body >

<el-row :gutter="20">
    <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
    <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
    <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
    <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
</el-row>

<!--<div id="app" style="width: 100%; height: 100%; background-color: #409eff">-->

<!--    <div style="width: 20%; height: 100%; background-color: #666666; background-size: 30% ">按钮</div>-->
<!--    <div style="width: 80%; height: 100%; left: 20%; background-color: #8cc5ff ">文本</div>-->


<!--&lt;!&ndash;-->
<!--    &lt;!&ndash; 测试 axios &ndash;&gt;-->
<!--    <button onclick="getLocal()">点我</button>-->

<!--    &lt;!&ndash; 测试 vue &ndash;&gt;-->
<!--    <input v-model="username">-->
<!--    {{username}}-->


<!--    &ndash;&gt;-->
<!--</div>-->









    <script>

        // 创建 Vue 核心对象
        new Vue({
            el:"#app",
            data(){

                return{
                    username: ""
                }

            }



        })








        function getLocal() {
            alert("你好啊");
            axios({
                method:"get",
                url:"https://restapi.amap.com/v3/geocode/geo?address=" + "广东省茂名市电白区霞洞镇永乐小学" + "&output=JSON&key=93b332a46a820fb32ad2fe70976743f5"
                // url:"https://restapi.amap.com/v3/geocode/geo?address=" + _this.address + "&output=JSON&key=93b332a46a820fb32ad2fe70976743f5"
            }).then(function (resp) {

                alert(JSON.stringify(resp.data));

            })
        }




    </script>

</body>





</html>
